<template>
	<view class="user-info">
		<image class="avatar" :src="userinfo.avatar" mode="aspectFill"></image>
		<text class="name">{{ userinfo.name }}</text>
	</view>
</template>

<script setup>
const props = defineProps({
	userinfo: {
		type: Object,
		required: true,
		default: () => ({
			name: '',
			avatar: ''
		})
	}
})
</script>
admin
<style>
.user-info {
	display: flex;
	align-items: center;
	padding: 10px;
	background-color: #ffffff;
	border-radius: 8px;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.avatar {
	width: 50px;
	height: 50px;
	border-radius: 25px;
	margin-right: 10px;
}

.name {
	font-size: 16px;
	color: #333;
}
</style>